<template>
	<view style="width: 696rpx;" class="mx-auto pt-20n">
		<view class="w-full border-theme round-10 flex flex-a-c h-20n px-20">
			<text class="mr-14">昵称:</text>
			<input class="flex-1 h-full" name="input" v-model="nickname" placeholder="请输入新昵称" />
		</view>
		<view class="mt-30n w-full">
			<button class="textfff" style="backgroundColor:#c9b693;borderColor:#c9b693;" :loading="loading"
				@click='editInfo'>确认修改</button>
		</view>
	</view>
</template>

<script setup>
	import {
		myInfoEdit,
	} from '@/network/api.js'
	const nickname = ref()
	const loading = ref(false)
	const editInfo = async () => {
		if (!nickname.value) return uni.showToast({
			title: '请输入昵称',
			icon: 'none'
		})
		loading.value = true
		const res = await myInfoEdit({
			nickname: nickname.value
		})
		if (res.status === 200) {
			uni.showToast({
				title: '修改成功',
				icon: 'none'
			})
			setTimeout(() => {
				uni.navigateBack({
					delta: 1
				})
			}, 1000)
		} else {
			uni.showToast({
				title: res.msg,
				icon: 'none'
			})
		}
		loading.value = false
	}
</script>